<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div>博为峰</div>
		<input type="text" name="uname" value="张三" />
		<script type="text/javascript">
			//-----------------------文本DOM对象------------------------------------------
			//获取div标签对于的DOM对象
			var div = document.querySelector("div");
			// console.dir(div);
			// console.dir(div.innerHTML);

			//文本DOM对象
			var divChild = div.firstChild;
			// console.dir(divChild);

			//-----------------------属性DOM对象------------------------------------------
			var input = document.querySelector("input");
			//类似数组(不能调用数组的方法)
			var attr = input.attributes;
			attr = Array.from(attr);
			// console.log(attr.length);
			// console.log(attr);
			attr.forEach(function(e) {
				// console.dir(e);
			})

			//document
			console.log(document.nodeName, document.nodeType, document.nodeValue);
			//标签
			console.log(div.nodeName, div.nodeType, div.nodeValue);
			//属性
			console.log(attr[0].nodeName, attr[0].nodeType, attr[0].nodeValue);
			//文本
			console.log(divChild.nodeName, divChild.nodeType, divChild.nodeValue);
		</script>
	</body>
</html>
